<template>
  <img
    :crossorigin="crossorigin"
    @click="openPhotoBrowser()"
    :width="width"
    :height="height"
    v-on:error="loadDefault()"
  />
</template>
<script>
import Util from "@/libs/framework/util";
export default {
  props: {
    crossorigin: {
      type: String,
    },
    width: {
      type: String,
      default: "100%",
    },
    height: {
      type: String,
      default: "100%",
    },
    thumbUrl: {
      type: String,
      default: "/api/base/fileupload/downThumb",
    },
    downUrl: {
      type: String,
      default: "/api/base/fileupload/downFile",
    },
    type: {
      type: String,
      default: "full", //full:原图，thumb：缩略图
    },
    attachmentId: {
      type: String,
    },
    imgUrl: {
      type: String,
    },
    background: {
      type: String,
      default:
        "",
    },
  },
  methods: {
    loadDefault() {
      this.$el.src = this.background;
    },
    openPhotoBrowser() {},
  },
  computed: {
    url() {
      if (this.attachmentId) {
        if (this.type == "thumb") {
          return (
            Util.mapProxyOnProd(this.thumbUrl) +
            "?attachmentId=" +
            this.attachmentId
          );
        } else {
          return (
            Util.mapProxyOnProd(this.downUrl) +
            "?attachmentId=" +
            this.attachmentId
          );
        }
      }
      if (this.imgUrl) {
        return this.imgUrl;
      } else {
        return this.background;
      }
    },
  },
  mounted() {
    // if (this.attachmentId) {
    //   this.$framework.resourceLoader.load(this.attachmentId).then(value => {
    //     this.$el.src = value;
    //   });
    // } else if (this.imgUrl) {
    //   this.$el.src = this.imgUrl;
    // } else {
    //   this.$el.src = this.background;
    // }
  },
};
</script>
